:global {
  .headbox {
    margin: 0 auto;
    color: #999999;
    background-color: #fff;
    font-size: 14px;

    .headbar {
      height: 80px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      overflow: hidden;

      .leftbox {
        margin: 0;
      }

      .rightbox {
        display: flex;
        margin: 0;

        a {
          color: #999999;
        }
      }

      &::after {
        content: '';
        position: absolute;
        height: 80px;
        top: 0;
        width: 100%;
        left: 0;
        z-index: 10;
        box-shadow: 2px 2px 20px #C2C2C2;
        pointer-events: none;
      }
    }

    .company_banner {
      width: 100%;
      background-color: red;
      height: 150px;
      background-color: #EDEDED;
      display: flex;
      align-items: center;
      overflow: hidden;


      .banner.centerbox {
        display: flex;
        justify-content: space-between;

        .banner_left {
          position: relative;
          display: flex;
          justify-content: space-between;
          align-items: center;

          .banner_logo {
            width: 60px;
            height: 60px;
            display: inline-block;
          }

          .banner_text {
            padding-left: 40px;

            .banner_title {
              margin: 0;
              color: #3679C6;
              font-size: 32px;
            }

            .banner_content {
              font-size: 16px;
            }
          }
        }

        .banner_left::before {
          position: absolute;
          height: 70px;
          width: 2px;
          content: '';
          top: 1px;
          bottom: 0;
          left: 80px;
          background: url("../image/logo_line.gif") no-repeat;
        }

        .banner_right {
          display: flex;
          align-items: center;

          .icon-phone {
            font-size: 60px;
            margin-right: 11px;
          }

          .phone_text {
            display: flex;
            flex-direction: column;
            justify-content: center;

            .phone_title {
              margin: 0;
              font-size: 20px;
              line-height: 20px;
            }

            .phone_number {
              font-size: 30px;
              line-height: 32px;
            }
          }
        }
      }

    }

    .nav_bar {
      width: 100%;
      height: 55px;
      background: url("../image/nav_bg.gif") no-repeat center center;
      display: flex;
      align-items: center;
      overflow: hidden;

      .nav {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;

        li {
          padding: 0px 17px;
          height: 45px;
          line-height: 45px;
          display: block;
          color: #fff;
          cursor: pointer;
          position: relative;
          overflow: hidden;

          &:hover {
            background: url("../image/nav_a.gif") center center;
          }
          a{
            color: #fff;
            display: block;
            width: 100%;
          }
        }

        &::before {
          content: '';
          width: 1000px;
          height: 55px;
          position: absolute;
          left: -130%;
          background: url('../image/nav_before_bg.gif') center center;
        }

        &::after {
          content: '';
          width: 1000px;
          height: 55px;
          position: absolute;
          right: -129%;
          background: url('../image/nav_after_bg.gif') center center;
        }
      }
    }

    .hot_word {
      height: 40px;
      display: flex;
      align-items: center;
      overflow: hidden;

      .hot_word_nav {
        display: flex;

        li {
          padding: 5px 8px;
        }
      }
    }
  }
}
